<template>
    <Card dis-hover :bordered="false">
        <Tabs v-model="menuName" :animated="false" @on-click="clickTabs">
            <TabPane :label="`留言(${alltotal.grabTotal})`" name="grap">
                <grap ref="grap" @returntotal="returntotal" :clue_status_id="clue_status_id"/>
            </TabPane>
            <TabPane :label="`来电(${alltotal.callTotal})`" name="call">
                <call ref="call" @returntotal="returntotal" :clue_status_id="clue_status_id"/>
            </TabPane>
            <TabPane :label="`微信(${alltotal.wechatTotal})`" name="wechat">
                <wechat ref="wechat" @returntotal="returntotal" :clue_status_id="clue_status_id"/>
            </TabPane>
            <TabPane :label="`客服录入(${alltotal.entryTotal})`" name="entry">
                <entry ref="entry" @returntotal="returntotal" :clue_status_id="clue_status_id" :added="true"/>
            </TabPane>
        </Tabs>
    </Card>
</template>

<script>
import entry from './entry'
import call from './call'
import grap from './grap'
import wechat from './wechat'
import { clueusercluecount } from "@api/hqapi/indextwo.js";
export default {
    name: 'newData', // 新数据
    components: { call,grap,wechat,entry },
    data() {
        return {
            menuName: 'grap',
            alltotal: {
                callTotal: 0,
                entryTotal: 0,
                grabTotal: 0,
                wechatTotal: 0,
            },
            clue_status_id: 9
        };
    },

    mounted() {
        let params = {
            clue_status_id: this.clue_status_id,		
            start_date: this.$Date().add(-10, 'day').format("YYYY-MM-DD"),	
            end_date: this.$Date().format("YYYY-MM-DD")
        }
        clueusercluecount(params).then(res=>{
            this.alltotal = res
            this.$refs.grap.initial()
        })
    },

    methods: {
        clickTabs(e) {
            this.$refs[e].initial()
        },
        returntotal(e) {
            switch (e.key) {
                case 'call': this.alltotal.callTotal = e.total; break;
                case 'entry': this.alltotal.entryTotal = e.total; break;
                case 'grap': this.alltotal.grabTotal = e.total; break;
                case 'wechat': this.alltotal.wechatTotal = e.total; break;
            }
        }
    },
};
</script>

<style lang="less" scoped>

</style>